Qt入门与实践:一文让你开启Qt大门!附实战项目源码

您所在的位置:网站首页 qt creator入门 Qt入门与实践:一文让你开启Qt大门!附实战项目源码

Qt入门与实践:一文让你开启Qt大门!附实战项目源码

2023-12-07 13:05| 来源: 网络整理| 查看: 265

注意:本文不允许转载,谢谢合作

文章目录 1.Qt概述1.1 什么是Qt1.2 Qt的发展史1.3 支持的平台1.4 Qt 版本1.5 Qt 的下载与安装1.5.1 下载1.5.2 安装 1.6 MSVC方式编译环境搭建1.6.1 VS2019安装1.6.2 QT5 安装1.6.3 MSVC调试器安装1.6.4 Qt Creator配置编译器和调试器1.6.5 配置完成,进行测试 2.创建Qt项目2.1 使用向导创建2.2 .pro文件2.3 一个最简单的Qt应用程序 3.第一个Qt小程序3.1 运行一下默认生成的程序3.2 添加两个按钮(使用代码添加)3.3 Qt窗口坐标体系3.4 以可视化方式创建两个按钮3.4.1 在Creator内打开界面设计器3.4.2 在窗口添加两个按钮3.4.3 点击按钮生成Qt版本的Hello World 4.信号和槽机制4.1 系统自带的信号和槽4.2 自定义信号和槽4.3 信号槽的拓展4.4 Qt4 版本的信号槽写法4.5 Lambda 表达式 5.常用控件5.1 标签:QLabel5.1.1 显示文字(普通文本、html)5.1.2 显示图片5.1.3 显示动画 5.2 输入框:QLineEdit5.2.1 设置/获取内容5.2.2 设置显示模式 5.3 按钮:QPushButton5.3.1 QPushButton Properties 属性5.3.2 QPushButton Public Functions 公共方法5.3.3 QPushButton Reimplemented Public Functions 经过重载的公共方法5.3.4 QPushButton Public Slots 公共槽函数5.3.5 QPushButton Protected Functions 保护函数5.3.6 QPushButton Reimplemented Protected Functions 经过重载的保护函数5.3.7 QPushButton Detailed Description 细节说明 6.实战项目:点名程序6.1 新建工程6.2 设计界面6.3 使用设计器设置控件属性6.3.1 修改窗口名称6.3.2 修改姓名滚动标签字体和大小6.3.3 修改复位,开始,停止按钮6.3.4 修改信息提示标签字体,大小6.3.5 界面对象名称总结 6.4 依次给每个按钮添加槽函数6.5 思考点名程序功能6.6 程序实现6.6.1 初始化名字列表6.6.2 随机获取名字6.6.3 开始标签滚动6.6.4 停止标签滚动6.6.5 复位按钮功能 6.7 程序演示 7.Qt程序打包 感谢大家!!!

1.Qt概述 1.1 什么是Qt

Qt是一个跨平台的 C++图形用户界面应用程序框架。它为应用程序开发者提供建立艺术级图形界面所需的所有功能。它是完全面向对象的,很容易扩展,并且允许真正的组件编程。

1.2 Qt的发展史

1991年 Qt 最早由奇趣科技开发 1996年 进入商业领域,它也是目前流行的 Linux 桌面环境 KDE 的基础 2008年 奇趣科技被诺基亚公司收购,Qt 称为诺基亚旗下的编程语言 2012年 Qt 又被 Digia 公司收购 2014 年 4 月 跨平台的集成开发环境 Qt Creator3.1.0 发布,同年 5 月 20 日配发了Qt5.3 正式版,至此 Qt 实现了对 iOS、Android、WP 等各平台的全面支持。

当前Qt 最新版本为 5.15.1

1.3 支持的平台 Windows – XP、Vista、Win7、Win8、Win2008、Win10Uinux/X11 – Linux、Sun Solaris、HP-UX、Compaq Tru64 UNIX、IBM AIX、 SGI IRIX、FreeBSD、BSD/OS、和其他很多 X11 平台Macintosh – Mac OS XEmbedded – 有帧缓冲支持的嵌入式 Linux 平台,Windows CE 1.4 Qt 版本

Qt按照不同的版本发行,分为商业版和开源版

商业版 为商业软件提供开发,他们提供传统商业软件发行版,并且提供在商业有效期内的免费升级和技术支持服务开源的 LGPL 版本: 为了开发自有而设计的开放源码软件,它提供了和商业版本同样的功能,在GNU 通用公共许可下,它是免费的。 1.5 Qt 的下载与安装 1.5.1 下载

参考我的博客:https://blog.csdn.net/u014779536/article/details/104632239

清华大学开源软件镜像站:https://mirrors.tuna.tsinghua.edu.cn/qt/archive/qt/

image-20201014172830629

Qt 5.15 是 Qt5 最后的LTS,同时 Qt 5.9 LTS 也将于5月31日终止。

从 Qt 5.15开始,开源版本,无论是不是 LTS,都只能在线安装。

Qt5.15安装请参考:https://blog.csdn.net/u014779536/article/details/106788778

1.5.2 安装 准备好安装包

image-20201014192852365

双击打开

image-20201014193203221

登录账号

image-20201014193237566

同意条款

image-20201014193310233

选择安装路径

image-20201014193334459

image-20201014193353241

选择组件

image-20201014193507457

同意条款

image-20201014193530311

继续下一步,进行安装

image-20201014193549363

image-20201014193557614

正在安装(安装大概持续5分钟)

image-20201014193611184

安装完成

image-20201014194802950

image-20201014194856776

1.6 MSVC方式编译环境搭建

参考博客:https://blog.csdn.net/u014779536/article/details/106848863

1.6.1 VS2019安装

我们在这里选择社区版: https://visualstudio.microsoft.com/zh-hans/vs/

下载软件 https://blog.csdn.net/zyhse/article/details/105362609安装配置 在这里插入图片描述 我们主要使用它的编译器。 1.6.2 QT5 安装

我们在这里选择 Qt5.14.2: https://mirrors.tuna.tsinghua.edu.cn/qt/archive/qt/5.14/ 在这里插入图片描述 在这里插入图片描述 直接下一步,下一步装完就行,没什么可说的。

1.6.3 MSVC调试器安装

通过windows SDK工具安装调试器: https://developer.microsoft.com/zh-cn/windows/downloads/windows-10-sdk/ 安装程序下载 在这里插入图片描述 安装过程 在这里插入图片描述在这里插入图片描述 在这里插入图片描述 在这里插入图片描述 在这里插入图片描述

1.6.4 Qt Creator配置编译器和调试器 打开 工具-> 选项 在这里插入图片描述配置 Debuggers 这里系统会自动检测到,不用选择,如果没有检测到,请重新按照第3节安装。 在这里插入图片描述配置编译器 这里也会自动检测到,如果没有,请重新按照第1节进行安装。 在这里插入图片描述配置Qt 5.14.2 MSVC2017 32bit 在这里插入图片描述配置Qt 5.14.2 MSVC2017 64bit 在这里插入图片描述 1.6.5 配置完成,进行测试 文件编码格式要为UTF-8-BOM 在这里插入图片描述配置断点 在这里插入图片描述执行调试模式 在这里插入图片描述 2.创建Qt项目 2.1 使用向导创建

image-20201014195236229

image-20201014195259339

设置工程名和路径

image-20201014195347667

选择qmake

image-20201014195425514

设置主界面类及ui文件名称,默认即可

image-20201014195523027

多语言,默认即可

image-20201014195722502

选择编译方式

image-20201014195904131

添加版本控制

image-20201014195938372

完成创建,自动生成工程

image-20201014200035431

2.2 .pro文件

在使用 Qt 向导生成的应用程序.pro 文件格式如下:

QT += core gui greaterThan(QT_MAJOR_VERSION, 4): QT += widgets CONFIG += c++11 # The following define makes your compiler emit warnings if you use # any Qt feature that has been marked deprecated (the exact warnings # depend on your compiler). Please consult the documentation of the # deprecated API in order to know how to port your code away from it. DEFINES += QT_DEPRECATED_WARNINGS # You can also make your code fail to compile if it uses deprecated APIs. # In order to do so, uncomment the following line. # You can also select to disable deprecated APIs only up to a certain version of Qt. #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0 SOURCES += \ main.cpp \ mainwindow.cpp HEADERS += \ mainwindow.h FORMS += \ mainwindow.ui # Default rules for deployment. qnx: target.path = /tmp/$${TARGET}/bin else: unix:!android: target.path = /opt/$${TARGET}/bin !isEmpty(target.path): INSTALLS += target

.pro 就是工程文件(project),它是 qmake 自动生成的用于生产 makefile 的配置文件。.pro 文件的写法如下:

注释

从“#”开始,到这一行结束。

指定生成的应用程序名: TARGET = QtDemo

工程中包含的头文件 HEADERS += include/painter.h

工程中包含的.ui 设计文件 **FORMS ** += forms/painter.ui

工程中包含的源文件 SOURCES += sources/main.cpp sources

工程中包含的资源文件 RESOURCES += qrc/painter.qrc

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

这条语句的含义是,如果QT_MAJOR_VERSION大于4(也就是当前使用的Qt5及更高版本)需要增加widgets模块。如果项目仅需支持Qt5,也可以直接添加“QT += widgets”一句。不过为了保持代码兼容,最好还是按照QtCreator生成的语句编写。

配置信息 CONFIG 用来告诉 qmake 关于应用程序的配置信息。 CONFIG += c++11 //使用 c++11 的特性

在这里使用“+=”,是因为我们添加我们的配置选项到任何一个已经存在中。这样做比使用“=”那样替换已经指定的所有选项更安全。

2.3 一个最简单的Qt应用程序

main入口函数中 :

#include "mainwindow.h" #include int main(int argc, char *argv[]) { QApplication a(argc, argv); MainWindow w; w.show(); return a.exec(); }

解释:

Qt 系统提供的标准类名声明头文件没有.h 后缀Qt 一个类对应一个头文件,类名就是头文件名QApplication 应用程序类 管理图形用户界面应用程序的控制流和主要设置。是 Qt 的整个后台管理的命脉它包含主事件循环,在其中来自窗口系统和其它资源的****所有事件处理和调度。它也处理应用程序的初始化和结束,并且提供对话管理。对于任何一个使用 Qt 的图形用户界面应用程序,都正好存在一个QApplication 对象,而不论这个应用程序在同一时间内是不是有 0、1、 2 或更多个窗口。 a.exec() 程序进入消息循环,等待对用户输入进行响应。这里 main()把控制权转交给Qt,Qt 完成事件处理工作,当应用程序退出的时候 exec()的值就会返回。在 exec()中,Qt 接受并处理用户和系统的事件并且把它们传递给适当的窗口部件。 3.第一个Qt小程序 3.1 运行一下默认生成的程序 点击运行按钮,或者按Ctrl+B

image-20201014201243879

什么也没有

image-20201014201307362

3.2 添加两个按钮(使用代码添加)

我们首先来到主窗口的构造函数

image-20201015082012435

添加以下代码:

MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) , ui(new Ui::MainWindow) { ui->setupUi(this); //头文件 #include QPushButton * btn = new QPushButton; btn->resize(100,20); //设置父亲 btn->setParent(this); //设置文字 btn->setText("德玛西亚"); //移动位置 btn->move(100,100); //第二种创建 QPushButton * btn2 = new QPushButton("孙悟空",this); btn2->resize(100,20); //重新指定窗口大小 this->resize(600,400); //设置窗口标题 this->setWindowTitle("第一个项目"); //限制窗口大小 this->setFixedSize(600,400); }

image-20201015082418087

运行代码,查看效果

image-20201015082640885

大家有没有觉得这样添加控件太麻烦了?别着急,我们先来看一下Qt窗口坐标体系

3.3 Qt窗口坐标体系

坐标体系: 以左上角为原点(0,0),X 向右增加,Y 向下增加。

image-20201015085817450

对于嵌套窗口,其坐标是相对于父窗口来说的。

3.4 以可视化方式创建两个按钮

根据3.2节来创建我们的界面真的是太麻烦了!我们有没有更好的方式呢?

有的!Qt 为我们提供了界面可视化创建工具:Qt Designer

image-20201015090127032

这么多?我们该选哪一个呢?

使用Qt Creator开发的话就不用选择,系统内直接打开。其他情况就根据您所选的编译方式来决定选用哪个版本。

等不及了,让我们开始吧~

3.4.1 在Creator内打开界面设计器

image-20201015090519828

自动跳转到设计界面

image-20201015090658620

3.4.2 在窗口添加两个按钮

拖动,拖动,拖动,这次我们直接拖动控件到窗口区

image-20201015090905032

我们可以对按钮进行属性设置,这里,我们就改一个名字

双击即可更改内容,此处我们改为按钮1,按照同样的方法添加按钮2

image-20201015091247230

运行,试试效果

image-20201015091340601

这里我们先把通过代码添加按钮的代码删除,进行下一个环节

image-20201015091457849

image-20201015091530316

3.4.3 点击按钮生成Qt版本的Hello World

我们刚才已经成功创建了按钮,但是我们点击按钮却没有任何反应。

这是为什么呢?

因为我们只是添加了按钮,却没有让它做任何事情,那么,它肯定不会有任何动作啦~

接下来先跟着操作一遍,具体原理第4节就会进行说明。

双击打开mainwindow.ui界面文件

image-20201015092336390

使用鼠标右键单击按钮1

弹出菜单,点击转到槽:

image-20201015092556961

转到槽窗口

image-20201015092641835

选择clicked(),表示单击信号,点击ok

image-20201015092803056

接下来在界面顶端添加QDebug头文件

image-20201015092915237

#include

然后在向刚才按钮生成的槽函数中添加以下打印代码

image-20201015093042235

void MainWindow::on_pushButton_clicked() { qDebug() qDebug() ui->setupUi(this); // 新建一个按钮,并关联窗口关闭槽函数(系统自带) QPushButton * quitBtn = new QPushButton("关闭窗口",this); connect(quitBtn,&QPushButton::clicked,this,&MainWindow::close); // 关联自定义信号与槽 connect(this,&MainWindow::signals_hungury,this,&MainWindow::slot_eat); }

在按钮中使用该信号

image-20201015101526100

其中,emit表示要发出信号了:

void MainWindow::on_pushButton_clicked() { qDebug() signals_hungury(); }

运行查看效果

image-20201015101812685

**自定义信号槽需要注意的事项: **

发送者和接收者都需要是QObject的子类(当然,槽函数是全局函数、Lambda表达式等无需接收者的时候除外);信号和槽函数返回值是 void信号只需要声明,不需要实现槽函数需要声明也需要实现槽函数是普通的成员函数,作为成员函数,会受到 public、private、 protected 的影响;使用 emit 在恰当的位置发送信号;使用connect()函数连接信号和槽。任何成员函数、static 函数、全局函数和 Lambda 表达式都可以作为槽函数信号槽要求信号和槽的参数一致,所谓一致,是参数类型一致。如果信号和槽的参数不一致,允许的情况是,槽函数的参数可以比信号的少,即便如此,槽函数存在的那些参数的顺序也必须和信号的前面几个一致起来。这是因为,你可以在槽函数中选择忽略信号传来的数据(也就是槽函数的参数比信号的少)。 4.3 信号槽的拓展 一个信号可以和多个槽相连 如果是这种情况,这些槽会一个接一个的被调用,但是它们的调用顺序是不确定的。多个信号可以连接到一个槽 只要任意一个信号发出,这个槽就会被调用。一个信号可以连接到另外的一个信号 当第一个信号发出时,第二个信号被发出。除此之外,这种信号-信号的形式和信号-槽的形式没有什么区别。槽可以被取消链接 这种情况并不经常出现,因为当一个对象delete之后,Qt自动取消所有连接到这个对象上面的槽。信号槽可以断开 利用disconnect 关键字是可以断开信号槽的使用 Lambda 表达式 在使用 Qt 5 的时候,能够支持 Qt 5 的编译器都是支持 Lambda 表达式的。 在连接信号和槽的时候,槽函数可以使用 Lambda 表达式的方式进行处理。

后面我们会详细介绍什么是 Lambda 表达式 。

4.4 Qt4 版本的信号槽写法 connect(this,SIGNAL(signals_hungury()),this,SLOT(slot_eat()));

这里使用了 SIGNAL 和 SLOT 这两个宏,将两个函数名转换成了字符串。注意到connect()函数的 signal 和 slot 都是接受字符串,一旦出现连接不成功的情况,Qt4 是没有编译错误的(因为一切都是字符串,编译期是不检查字符串是否匹配),而是在运行时给出错误。这无疑会增加程序的不稳定性。 Qt5 在语法上完全兼容 Qt4,而反之是不可以的。

4.5 Lambda 表达式

C++11 中的 Lambda 表达式用于定义并创建匿名的函数对象,以简化编程工作。首先看一下Lambda 表达式的基本构成:

//[函数对象参数](操作符重载函数参数)mutable ->返回值{函数体} [capture](parameters) mutable -> return-type { statement }

① 函数对象参数;

[],标识一个 Lambda 的开始,这部分必须存在,不能省略。函数对象参数是传递给编译器自动生成的函数对象类的构造函数的。函数对象参数只能使用那些到定义 Lambda 为止时 Lambda 所在作用范围内可见的局部变量(包括Lambda 所在类的 this)。函数对象参数有以下形式:

空 |没有使用任何函数对象参数。= |函数体内可以使用 Lambda 所在作用范围内所有可见的局部变量(包括 Lambda 所在类的 this),并且是值传递方式(相当于编译器自动为我们按值传递了所有局部变量)。& |函数体内可以使用 Lambda 所在作用范围内所有可见的局部变量(包括 Lambda 所在类的 this),并且是引用传递方式(相当于编译器自动为我们按引用传递了所有局部变量)。this |函数体内可以使用 Lambda 所在类中的成员变量。a |将 a 按值进行传递。按值进行传递时,函数体内不能修改传递进来的a 的拷贝,因为默认情况下函数是 const 的。要修改传递进来的 a 的拷贝,可以添加 mutable修饰符。&a |将 a 按引用进行传递。a, &b |将 a 按值进行传递,b 按引用进行传递。=,&a, &b |除 a 和 b 按引用进行传递外,其他参数都按值进行传递。&, a, b |除 a 和 b 按值进行传递外,其他参数都按引用进行传递。

② 操作符重载函数参数; 标识重载的()操作符的参数,没有参数时,这部分可以省略。参数可以通过按值(如:(a,b))和按引用(如:(&a,&b))两种方式进行传递。

③ 可修改标示符; mutable 声明,这部分可以省略。按值传递函数对象参数时,加上 mutable修饰符后,可以修改按值传递进来的拷贝(注意是能修改拷贝,而不是值本身)。

QPushButton * myBtn = new QPushButton (this); QPushButton * myBtn2 = new QPushButton (this); myBtn2->move(100,100); int m = 10; connect(myBtn,&QPushButton::clicked,this,[m] ()mutable { m = 100 + 10; qDebug() qDebug() qDebug() qDebug() // 清空该容器 this->allNameList.clear(); // 向容器中新增名字 this->allNameList.append(QString("张三")); this->allNameList.append(QString("李四")); this->allNameList.append(QString("王五")); this->allNameList.append(QString("王二麻子")); this->allNameList.append(QString("孙悟空")); this->allNameList.append(QString("猪八戒")); this->allNameList.append(QString("奥特曼")); this->allNameList.append(QString("张飞")); this->allNameList.append(QString("武松")); // 打印一下 qDebug() // 获取姓名列表长度 int nameLength = this->allNameList.length(); // 根据时间来设置种子,保证真随机 QTime time = QTime::currentTime(); qsrand(time.msec()+time.second()*1000); //设置随机数种子 int rand = qrand() % nameLength; //产生名字总数内的随机数 // 取得名字 QString randomName = this->allNameList[rand]; // 返回名字 return randomName; }

我们将此函数添加到开始按钮槽函数内进行测试

image-20201015155342773

void MainWindow::on_pushButton_start_clicked() { qDebug() label_rollNames->setText(name); }

使用前记得复位,不然名称列表里面没名字

6.6.3 开始标签滚动

标签通过什么方式就可以滚动了呢?

滚动,其实也就是定时切换,我们需要用到定时器

在头文件中添加定时器声明

引入头文件:#include

image-20201015161220280

添加定时器结束槽函数定义:

image-20201015161447609

void MainWindow::rollTimerTimeOut() { // 随机获取名字 QString name = this->getRandomName(); // 设置滚动标签为随机获取到的名字 ui->label_rollNames->setText(name); }

定义定时器对象,并关联槽函数:

image-20201015161633701

MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) , ui(new Ui::MainWindow) { ui->setupUi(this); // 系统启动时进行复位 this->on_pushButton_reset_clicked(); // 关联定时器定时到信号与槽函数 this->rollTimer = new QTimer(this); connect(rollTimer,&QTimer::timeout,this,&MainWindow::rollTimerTimeOut); }

运行程序

image-20201015161755448

并没有滚动,为什么呢?

原来啊,是我们没有启动定时器,我们在开始按钮槽函数里面启动定时器

image-20201015161915533

void MainWindow::on_pushButton_start_clicked() { qDebug() qDebug() qDebug() label_rollNames->setText("等待开始"); ui->label_message->setText("幸运儿是你吗?"); ui->label_message->setStyleSheet("color: red"); } 6.7 程序演示

image-20201015163014871

image-20201015163028986

7.Qt程序打包

现在程序开发完成了,我们怎么打包给其他用户进行使用呢?

目前我们都是使用的Debug版本,为了发布,我们使用Release版本进行编译

image-20201015163241544

​ 运行一次

image-20201015163323668

来到工程路径

image-20201015163135272

返回上一级,进入Release文件夹

image-20201015163356607

image-20201015163407139

从开始菜单找到命令行工具,注意与自己的编译方式一致!!

image-20201015163512128

进入刚才Release程序路径

image-20201015163606644

执行命令 windeployqt CallNames_System.exe

image-20201015163717879

image-20201015163805922

image-20201015163829291

将本路径内容全部压缩到一个压缩包,发给其它人即可使用!

image-20201015163927994

image-20201015163946219

至此,将压缩包发送给其它人即可使用!

image-20201015164015101

感谢大家!!!


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3